﻿<!DOCTYPE html>

<head>
    <meta charset="utf-8">

    <title>
        后台管理</title>
    <script src="./config/config.js"></script>
    <script src="./js/jquery-1.10.2.min.js"></script>
    <script src="./js/jquery.cookie.js"></script>
    <script src="./constant/common.js"></script>
    <script src="./constant/constant.js"></script>
    <script src="./js/prop-types.js"></script>
    <script src="./js/MD5.js"></script>
    <script src="./js/bootstrap.min.js"></script>
    <script src="./js/react/react.development.js"></script>
    <script src="./js/react/react-dom.development.js"></script>
    <script src="./js/vConsole.js"></script>
    <link href="./css/common.css" rel="stylesheet" type="text/css" />
    <link href="./css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <meta name="viewport"
        content="width=device-width,user-scalable=no,initial-scale=1, minimum-scale=1,maximum-scale=1" />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="format-detection" content="telephone=no">
    <meta name="renderer" content="webkit" />
    <meta name="force-rendering" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="full-screen" content="yes" />
    <meta name="x5-fullscreen" content="true" />
    <meta name="360-fullscreen" content="true" />
    <meta name="screen-orientation" content="portrait" />
    <meta name="x5-orientation" content="portrait">
    <!--<meta name="browsermode" content="application">-->
    <meta name="x5-page-mode" content="app">
    <style>
        .gonghangarea {
            position: absolute;
            right: 60px;
            top: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .gonghangarea img {
            width: 3.125vw;
            height: 3.125vw;
            margin-right: 10px;
        }

        .gonghangarea p {
            margin: 0;
            font-size: 17pt;
            color: #D1282D;
            font-weight: bolder;
        }

        .loginbg {
            width: 100vw;
            position: absolute;
            left: 0;
            top: 0;
        }

        .title {
            font-size: 18pt;
            margin-bottom: 5vh;
            color: #D1282D;
            font-family: Source Han Sans SC-Bold, Source Han Sans SC;
            font-weight: bolder;
        }

        .input-group-addon {}

        .input-group {
            margin-bottom: 3vh;
        }

        .alertarea {
            position: absolute;
            width: 100vw;
        }

        #yzmbtn {
            cursor: pointer;
        }

        .btn-primary {
            width: 330px !important;
            height: 49px;
            margin-top: 18px;
            background: #D1282D;
            border: none;
            box-shadow: 0px 8px 12px 1px rgba(84, 0, 2, 0.28);
            border-radius: 20px;
        }

        .all {
            position: absolute;
            right: 16vw;
            top: 40vh;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-items: center;
        }

        .input-phone {
            display: flex;
            align-items: center;
            width: 330px;
            justify-content: center;
            padding: 12px 25px;
            border: 1px solid #707070;
            border-radius: 20px;
            margin-bottom: 20px;
        }



        .input-phone p {
            margin: 0;
            font-size: 14pt;
            height: 14pt;
            display: flex;
            align-items: center;
            justify-content: center;
            padding-right: 8px;
            border-right: 2px solid #5a5a5a;
            margin-right: 8px;
        }

        .input-phone.r {
            justify-content: space-between;
        }

        .input-phone.r p {
            cursor: pointer;
            margin: 0;
            font-size: 12pt;
            height: 14pt;
            display: flex;
            align-items: center;
            justify-content: center;
            padding-left: 8px;
            border: none;
            border-left: 2px solid #5a5a5a;
            margin-left: 8px;
        }

        .input-phone input {
            border: none;
            font-size: 14pt;
            font-family: Source Han Sans SC-Regular, Source Han Sans SC;
            font-weight: 400;
            color: #5A5A5A;
        }
        .all .jsfw1{
            margin-top: 40px;
            display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
        }

        .input-phone.r input {
            width: 150px;
        }
    </style>

</head>

<body>
    <!-- <div class='container'></div> -->
    <img class="loginbg" src="./src/login-bg1.png" />
    <div class="alertarea">
    </div>
    <!-- <div class="gonghangarea">
        <img src="./src/ghlogo.png" alt="">
        <p>工商银行</p>
    </div> -->

    <div class=" c">

        <div class="all">
            <div class="center title">
               后台管理
                <!-- 代发工资 -->
            </div>
            <!-- <div class="input-group w40">
                        <span class="input-group-addon">手机号</span>
                        <input placeholder="请输入手机号" type="text" class="phone form-control" />
                    </div> -->
            <div class="input-phone">
                <input placeholder="请填写账号" type="text" class="name">
            </div>

            <div class="input-phone ">
                <input placeholder="请填写密码" type="password" class="pwd">
            </div>

            <!-- <div class="input-group w40">
                            <span id="yzmbtn"  class="input-group-addon">获取验证码</span>
                        <input placeholder="请输入验证码" type="password" class="yzcode form-control" />
                    </div> -->
                    

            <div class="center">
                <button id='login' class="btn btn-primary ">登录</button>
            </div>
           
        </div>
    </div>


</body>
<script>
    var username = '';
    var password = '';





    var countdown = 60;

    function settime() {
        if (countdown == 0) {
            //  $('#yzmbtn').attr("disabled",false); 
            $('#yzmbtn').text("获取验证码");
        } else {
            console.log('countdown', countdown);
            // $('#yzmbtn').attr("disabled", true); 
            $('#yzmbtn').text("重新发送(" + countdown + ")");
            countdown--;
            setTimeout(function () {
                settime()
            }, 1000)
        }

    }

    $(document).ready(function () {

        // testdingcan(res=>{

        // })

        document.onkeydown = function () {
            if (event.keyCode == 13) {
                login()
            }
        }

        $('#yzmbtn').click(function () {
            var name = $('.name').val() || "", pwd = $('.pwd').val() || '';
            console.log({name,pwd});
            if (name.length==''||pwd.length=='') {
                alert('账号或密码错误！')
            } else {
                pwd = md5(pwd + Constant.SALT).toUpperCase();
                console.log(pwd,'pwdpwd');
                xxxlogin({ name: phone, pwd }, res => {
                    if(res.issuccess==1){
 localStorage.setItem('token', res.Token)
                    localStorage.setItem('userid', res.userid)
                    $.cookie('token', res.Token);//cookie：储存在用户本地终端上的数据，
                    $.cookie('userid', res.userid);//cookie：储存在用户本地终端上的数据，
                    window.location.href = './orderlist.html';
                    }else{
                        alert(res.md5str)
                    }
                    //username[参数]：phone[值]调接口接受前段数据进行校验，校验成功后执行：将数据储存用户本地终端
                   
                }, msg => {  })//“,msg=>{alert(msg)}”中逗号之后表示校验失败后执行的内容
            }
            // console.log($('#yzmbtn').text()=='获取验证码','countdown');

        })

        function login() {
            var name = $('.name').val() || "", pwd = $('.pwd').val() || '';
            console.log({name,pwd});
            if (name.length==''||pwd.length=='') {
                alert('账号或密码错误！')
            } else {
                pwd = md5(pwd + Constant.SALT).toUpperCase();
                console.log(pwd,'pwdpwd');
                xxxlogin({ name, pwd }, res => {
                    if(res.issuccess==1){
 localStorage.setItem('token', res.Token)
                    localStorage.setItem('userid', res.id)
                    $.cookie('token', res.Token);//cookie：储存在用户本地终端上的数据，
                    $.cookie('userid', res.id);//cookie：储存在用户本地终端上的数据，
                    window.location.href = './list.html';
                    }else{
                        alert(res.md5str)
                    }
                    //username[参数]：phone[值]调接口接受前段数据进行校验，校验成功后执行：将数据储存用户本地终端
                   
                }, msg => {  })//“,msg=>{alert(msg)}”中逗号之后表示校验失败后执行的内容
            }
            // console.log($('#yzmbtn').text()=='获取验证码','countdown');
        }

        $('#login').click(function () {
            login()
        })


    })
</script>

</html>